<template>
	<view class="my-content">
		<view class="form-box">
			<text class="form-title">*电桩照片</text>
			<view class="ava-img" @click="uploadImage('avatar')">
				<image :src="formData.avatar" mode="widthFix" v-if="formData.avatar"></image>
				<text v-else>+</text>
			</view>
		</view>
		<view class="form-box">
			<text class="form-title">*电桩名称</text>
			<view class="form-item">
				<input type="text" placeholder="请输入电桩名称" v-model="formData.name" />
			</view>
			<text class="form-title mt20" style="display: none;">*电桩编号</text>
			<view class="form-item" style="display: none;">
				<input type="text" placeholder="请输入电桩编号" v-model="formData.sn" />
			</view>
			<text style="display: none;" class="form-title mt20">*请选择地图标点</text>
			<view style="display: none;" class="form-item" @click="showMapDialog = true">
				<text class="blue">{{ formData.location ? '已选择位置' : '请选择地图标点' }}</text>
			</view>
			<view style="display: none;" class="form-item" v-if="formData.lat||formData.lng">
				<input type="text" style="font-size: 14px;" placeholder="请输入纬度" v-model="formData.lat" />
				<input type="text" style="font-size: 14px;" placeholder="请输入经度" v-model="formData.lng" />
				<input type="text" style="display: none;" v-model="markers[0]['title']" />
				<input type="text" style="font-size: 14px;" v-model="markers[0]['address']" />
			</view>
			<view class="popup-mask" v-if="showMapDialog" @click="closeMap">
				<view class="popup-content" @click.stop>
					<view class="map-dialog">
						<view class="dialog-header">
							<text class="title">选择位置</text>
							<text class="close" @click="closeMap">×</text>
						</view>
						<map class="map" :latitude="mapCenter.latitude" :longitude="mapCenter.longitude"
							:markers="markers" @regionchange="onMapChange">
						</map>
						<view class="dialog-footer">
							<button class="btn cancel-btn" @click="closeMap">取消</button>
							<button class="btn confirm-btn" @click="confirmLocation">确认位置</button>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="form-box">
			<text class="form-title">*功率（千瓦）</text>
			<view class="form-item">
				<input type="number" placeholder="请输入功率" v-model="formData.rate" />
			</view>
			<text class="form-title">*快充/慢充</text>
			<view class="form-item">
				<picker mode="selector" @change="speed_change" :range="['请选择','快','慢']">
					<view class="blue"><text v-if="formData.speed==''">请选择</text><text v-if="formData.speed!=''">{{formData.speed}}</text></view>
				</picker>
			</view>
		</view>
		
		
		<view class="form-box">
			<text class="form-title">*电桩位置示意图照片</text>
			<view class="img-list">
				<view class="img-add" @click="uploadImage('images')" v-if="formData.images.length < 4">
					<text>+</text>
				</view>
				<view class="img-item" style="position: relative;" v-for="(item, index) in formData.images"
					:key="index">
					<div class="w-30 h-30 bg-red rounded-full" style="position: absolute;top: 0;right: 0;z-index: 9;">
						<image @click="formData.images = formData.images.filter(i => i != item)"
							src="/static/icon/close.png" class="w-30 h-30" mode="widthFix"></image>
					</div>
					<image :src="item" mode="widthFix"></image>
				</view>
			</view>
			<text class="num-box">{{ formData.images.length }}/4</text>
		</view>
		<view class="form-box" style="position: relative;">
			<view style="color: blue; text-align: right;position: absolute;top: 10px;left: 0;width: 95%;" @click="add"> 添加 </view>
			
			<text class="form-title">*营业开始时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.start_time" @change="onStartTimeChange">

					<text class="blue">{{ formData.start_time || '请选择营业开始时间' }}</text>
				</picker>
			</view>
		
			<text class="form-title">*营业结束时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.end_time" @change="onEndTimeChange">
					<text class="blue">{{ formData.end_time || '请选择营业结束时间' }}</text>
				</picker>
			</view>
		</view>
		<view class="form-box"  v-show="num>1" style="position: relative;">
			<view style="color: blue; text-align: right;position: absolute;top: 10px;left: 0;width: 95%;" @click="del(2)"> 删除 </view>
			<text class="form-title">*营业开始时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.start_time2" @change="onStartTimeChange2">
		
					<text class="blue">{{ formData.start_time2 || '请选择营业开始时间' }}</text>
				</picker>
			</view>
		
			<text class="form-title">*营业结束时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.end_time2" @change="onEndTimeChange2">
					<text class="blue">{{ formData.end_time2 || '请选择营业结束时间' }}</text>
				</picker>
			</view>
		</view>
		
		<view class="form-box"  v-show="num>2" style="position: relative;">
			<view style="color: blue; text-align: right;position: absolute;top: 10px;left: 0;width: 95%;" @click="del(3)"> 删除 </view>
			<text class="form-title">*营业开始时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.start_time3" @change="onStartTimeChange3">
		
					<text class="blue">{{ formData.start_time3 || '请选择营业开始时间' }}</text>
				</picker>
			</view>
		
			<text class="form-title">*营业结束时间</text>
			<view class="form-item">
				<picker mode="time" :value="formData.end_time3" @change="onEndTimeChange3">
					<text class="blue">{{ formData.end_time3 || '请选择营业结束时间' }}</text>
				</picker>
			</view>
		</view>
		<view class="form-box" style="display: none;">>
			<text class="form-title">*尖单价</text>
			<view class="form-item">
				<input type="text" placeholder="请输入尖单价" v-model="formData.price" />
			</view>

			<text class="form-title">*尖服务费（元）</text>
			<view class="form-item">
				<input type="text" placeholder="请输入尖服务费" v-model="formData.service_price" />
			</view>
		</view>
		<view class="form-box" style="display: none;">>
			<text class="form-title">*峰单价</text>
			<view class="form-item">
				<input type="text" placeholder="请输入峰单价" v-model="formData.price2" />
			</view>
		
			<text class="form-title">*峰服务费（元）</text>
			<view class="form-item">
				<input type="text" placeholder="请输入峰服务费" v-model="formData.service_price2" />
			</view>
		</view>
		
		<view class="form-box" style="display: none;">>
			<text class="form-title">*平单价</text>
			<view class="form-item">
				<input type="text" placeholder="请输入平单价" v-model="formData.price3" />
			</view>
		
			<text class="form-title">*平服务费（元）</text>
			<view class="form-item">
				<input type="text" placeholder="请输入平服务费" v-model="formData.service_price3" />
			</view>
		</view>
		
		<view class="form-box" style="display: none;">>
			<text class="form-title">*谷单价</text>
			<view class="form-item">
				<input type="text" placeholder="请输入谷单价" v-model="formData.price4" />
			</view>
		
			<text class="form-title">*谷服务费（元）</text>
			<view class="form-item">
				<input type="text" placeholder="请输入谷服务费" v-model="formData.service_price4" />
			</view>
		</view>
		
		
		
		
		<view class="form-box" style="display: none;">
			<text class="form-title">费率时区 ({{total_count}}/48) </text>
			
			<view style="width: 100%;display: flex;font-size: 12px; margin-top: 5px; margin-bottom: 5px;">
				<view style="width: 23%;margin-left: 2%;background-color: red; border-radius: 10rpx; color: #fff; font-size: 12px;text-align: center; padding: 5px 2px;">
					尖费({{jian_count}})
				</view>
				<view style="width: 23%;margin-left: 2%;background-color: orangered; border-radius: 10rpx;  color: #fff; font-size: 12px;text-align: center; padding: 5px 2px;">
					峰费({{feng_count}})
				</view>
				<view style="width: 23%;margin-left: 2%;background-color: blue; border-radius: 10rpx;  color: #fff;font-size: 12px; text-align: center; padding: 5px 2px;">
					平费({{ping_count}})
				</view>
				<view style="width: 23%;margin-left: 2%;background-color: green; border-radius: 10rpx;  color: #fff; font-size: 12px;text-align: center; padding: 5px 2px;">
					谷费({{gu_count}})
				</view>
			</view>
			
			
			<view style="width: 100%;display: flex;" v-if="loading==true">
				<view class="btntime" @click="dianji(0)" :class="'bg_'+shiqu[0]">
					0:00~0:30
				</view>
				<view class="btntime" @click="dianji(1)" :class="'bg_'+shiqu[1]">
					0:30~1:00
				</view>
				<view class="btntime" @click="dianji(2)" :class="'bg_'+shiqu[2]">
					1:00~1:30
				</view>
				<view class="btntime" @click="dianji(3)" :class="'bg_'+shiqu[3]">
					1:30~2:00
				</view>
			</view>
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(4)" :class="'bg_'+shiqu[4]">
					2:00~2:30
				</view>
				
				<view class="btntime" @click="dianji(5)" :class="'bg_'+shiqu[5]">
					2:30~3:00
				</view>
				<view class="btntime" @click="dianji(6)" :class="'bg_'+shiqu[6]">
					3:00~3:30
				</view>
				<view class="btntime" @click="dianji(7)" :class="'bg_'+shiqu[7]">
					3:30~4:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(8)" :class="'bg_'+shiqu[8]">
					4:00~4:30
				</view>
				<view class="btntime" @click="dianji(9)" :class="'bg_'+shiqu[9]">
					4:30~5:00
				</view>
				<view class="btntime" @click="dianji(10)" :class="'bg_'+shiqu[10]">
					5:00~5:30
				</view>
				<view class="btntime" @click="dianji(11)" :class="'bg_'+shiqu[11]">
					5:30~6:00
				</view>
			</view>
			
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(12)" :class="'bg_'+shiqu[12]">
					6:00~6:30
				</view>
				<view class="btntime" @click="dianji(13)" :class="'bg_'+shiqu[13]">
					6:30~7:00
				</view>
				<view class="btntime" @click="dianji(14)" :class="'bg_'+shiqu[14]">
					7:00~7:30
				</view>
				<view class="btntime" @click="dianji(15)" :class="'bg_'+shiqu[15]">
					7:30~8:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(16)" :class="'bg_'+shiqu[16]">
					8:00~8:30
				</view>
				<view class="btntime" @click="dianji(17)" :class="'bg_'+shiqu[17]">
					8:30~9:00
				</view>
				<view class="btntime" @click="dianji(18)" :class="'bg_'+shiqu[18]">
					9:00~9:30
				</view>
				<view class="btntime" @click="dianji(19)" :class="'bg_'+shiqu[19]">
					9:30~10:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(20)" :class="'bg_'+shiqu[20]">
					10:00~10:30
				</view>
				<view class="btntime" @click="dianji(21)" :class="'bg_'+shiqu[21]">
					10:30~11:00
				</view>
				<view class="btntime" @click="dianji(22)" :class="'bg_'+shiqu[22]">
					11:00~11:30
				</view>
				<view class="btntime" @click="dianji(23)" :class="'bg_'+shiqu[23]">
					11:30~12:00
				</view>
			</view>
			
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(24)" :class="'bg_'+shiqu[24]">
					12:00~12:30
				</view>
				<view class="btntime" @click="dianji(25)" :class="'bg_'+shiqu[25]">
					12:30~13:00
				</view>
				<view class="btntime" @click="dianji(26)" :class="'bg_'+shiqu[26]">
					13:00~13:30
				</view>
				<view class="btntime" @click="dianji(27)" :class="'bg_'+shiqu[27]">
					13:30~14:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(28)" :class="'bg_'+shiqu[28]">
					14:00~14:30
				</view>
				<view class="btntime" @click="dianji(29)" :class="'bg_'+shiqu[29]">
					14:30~15:00
				</view>
				<view class="btntime" @click="dianji(30)" :class="'bg_'+shiqu[30]">
					15:00~15:30
				</view>
				<view class="btntime" @click="dianji(31)" :class="'bg_'+shiqu[31]">
					15:30~16:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(32)" :class="'bg_'+shiqu[32]">
					16:00~16:30
				</view>
				<view class="btntime" @click="dianji(33)" :class="'bg_'+shiqu[33]">
					16:30~17:00
				</view>
				<view class="btntime" @click="dianji(34)" :class="'bg_'+shiqu[34]">
					17:00~17:30
				</view>
				<view class="btntime" @click="dianji(35)" :class="'bg_'+shiqu[35]">
					17:30~18:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(36)" :class="'bg_'+shiqu[36]">
					18:00~18:30
				</view>
				<view class="btntime" @click="dianji(37)" :class="'bg_'+shiqu[37]">
					18:30~19:00
				</view>
				<view class="btntime" @click="dianji(38)" :class="'bg_'+shiqu[38]">
					19:00~19:30
				</view>
				<view class="btntime" @click="dianji(39)" :class="'bg_'+shiqu[39]">
					19:30~20:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(40)" :class="'bg_'+shiqu[40]">
					20:00~20:30
				</view>
				<view class="btntime" @click="dianji(41)" :class="'bg_'+shiqu[41]">
					20:30~21:00
				</view>
				<view class="btntime" @click="dianji(42)" :class="'bg_'+shiqu[42]">
					21:00~21:30
				</view>
				<view class="btntime" @click="dianji(43)" :class="'bg_'+shiqu[43]">
					21:30~22:00
				</view>
			</view>
			
			<view style="width: 100%;display: flex;">
				<view class="btntime" @click="dianji(44)" :class="'bg_'+shiqu[44]">
					22:00~22:30
				</view>
				<view class="btntime" @click="dianji(45)" :class="'bg_'+shiqu[45]">
					22:30~23:00
				</view>
				<view class="btntime" @click="dianji(46)" :class="'bg_'+shiqu[46]">
					23:00~23:30
				</view>
				<view class="btntime" @click="dianji(47)" :class="'bg_'+shiqu[47]">
					23:30~24:00
				</view>
			</view>
			
		</view>
		
		
		<view class="form-box" v-if="id==''">
			<text class="form-title">*停车位</text>
			<view class="form-item">
				<view class="form-item">
					<picker mode="selector" @change="park_change" :range="park_arr">
						<view class="blue"><text v-if="formData.park_id==''">请选择</text><text v-if="formData.park_id!=''">{{formData.park_name}}</text></view>
					</picker>
				</view>
			</view>
		</view>
		
		<view class="form-box" >
			<text class="form-title">*停车免费时长（小时）</text>
			<view class="form-item">
				<view class="form-item">
					<picker mode="selector" @change="hour_change" :range="hour_arr">
						<view class="blue"><text v-if="formData.free_park_hour=='0'">请选择</text><text v-if="formData.free_park_hour!='0'">{{formData.free_park_hour}}</text></view>
					</picker>
				</view>
			</view>
		</view>
		
		
		<view class="form-box">
			<text class="form-title">*停车费说明</text>
			<view class="form-item">
				<textarea v-model="formData.docs" maxlength="60" @input="sumfontnum" placeholder="请输入停车费说明"></textarea>
				<text class="font-num">{{fontNum}}/60</text>
			</view>
		</view>
		<button class="submit" @click="submitForm">确认提交</button>
	</view>
</template>

<script>
	let shiqu = [
		0,0,0,0,0,0,0,0,0,0,0,0,
		0,0,0,0,0,0,0,0,0,0,0,0,
		0,0,0,0,0,0,0,0,0,0,0,0,
		0,0,0,0,0,0,0,0,0,0,0,0,
	];
	export default {
		data() {
			return {
				num:1,
				loading:true,
				showMapDialog: false,
				userInfo: {},
				formData: {
					avatar: '', // 电桩头像
					name: '', // 电桩名称
					sn: '', // 电桩编号
					rate:'',
					location: '', // 地图坐标
					images: [], // 电桩详情照片
					speed: '', // 电桩快充慢充
					start_time: '', // 营业开始时间
					end_time: '', // 营业结束时间
					start_time2: '', // 营业开始时间
					end_time2: '', // 营业结束时间
					start_time3: '', // 营业开始时间
					end_time3: '', // 营业结束时间
					docs:'',
					park_id:'',
					park_name:'',
					free_park_hour:0
				},
				mapCenter: {
					latitude: 39.908692,
					longitude: 116.397477
				},
				markers: [{
					id: 1,
					latitude: 39.908692,
					longitude: 116.397477,
					title:'',
					address:'',
					width:30,
					height:30,
					iconPath: '/static/icon/address2.png', // 自定义图标路径，如果需要的话
				}],
				fontNum:0,
				hour_arr:[0,1,2,3,4,5,6,7,8,9,10],
				range:[
					'请选择','尖费','峰费','平费','谷费'
				],
				
				shiqu : [
						0,0,0,0,0,0,0,0,0,0,0,0,
						0,0,0,0,0,0,0,0,0,0,0,0,
						0,0,0,0,0,0,0,0,0,0,0,0,
						0,0,0,0,0,0,0,0,0,0,0,0,
				],
				
				total_count : 0,
				jian_count : 0,
				feng_count : 0,
				ping_count : 0,
				gu_count : 0,
					
				park_arr:[],
				park_id:[],
				id:''
			}
		},
		onLoad(e) {
			this.getList()
			var that = this
			uni.getLocation({
				type: 'wgs84',
				success: (res) => {
					that.markers[0].latitude = res.latitude
					that.markers[0].longitude = res.longitude
					that.mapCenter.latitude = res.latitude
					that.mapCenter.longitude= res.longitude
				},
				fail: (e) => {
					console.log(e)
				}
			})
			
			shiqu = [
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
			];
			if(e&&e.id){
				this.info(e.id)
			}else{
				this.getUserInfo()
			}
		},
		onShow() {
			shiqu = [
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
				0,0,0,0,0,0,0,0,0,0,0,0,
			];
		},
		methods: {
			async getUserInfo() {
				const res = await this.http("get", "/api/user/user_info", {})
				this.userInfo = res.data
				console.log(this.userInfo)
				this.formData.lat = this.userInfo.station.lat
				this.formData.lng = this.userInfo.station.lng
				this.formData.location= this.formData.lat+','+this.formData.lng, // 地图坐标
				
				this.user_id = this.userInfo.id
			},
			add(){
				if(this.num<3){
					this.num = this.num+1
				}else{
					uni.showToast({
						title: '至多可以添加3个哦',
						icon: 'none'
					});
				}
			},
			del(i){
				if(this.num>1){
					this.num = this.num-1
				}
				if(i==2){
					if(this.formData.start_time3){
						this.formData.start_time2 = this.formData.start_time3
						this.formData.end_time2 = this.formData.end_time3
						this.formData.start_time3 = ''
						this.formData.end_time3 = ''
					}else{
						this.formData.start_time2 = ''
						this.formData.end_time2 = ''
					}
				}
				if(i==3){
					this.formData.start_time3 = ''
					this.formData.end_time3 = ''
				}
			},
			async info(id){
				this.id = id
				const res = await this.http("get", "/api/device/info", {
					id: id
				})
				shiqu = JSON.parse(res.data.cost_model)
				this.shiqu = shiqu
				this.formData={
					avatar: res.data.pic, // 电桩头像
					name: res.data.name, // 电桩名称
					sn: res.data.sn, // 电桩编号
					rate:res.data.rate,
					location: res.data.lat+','+res.data.lng, // 地图坐标
					images: res.data.images.split(','), // 电桩详情照片
					speed: res.data.speed, // 电桩快充慢充
					start_time: res.data.start_time, // 营业开始时间
					end_time: res.data.end_time, // 营业结束时间
					start_time2: res.data.start_time2, // 营业开始时间
					end_time2: res.data.end_time2, // 营业结束时间
					start_time3: res.data.start_time3, // 营业开始时间
					end_time3: res.data.end_time3, // 营业结束时间
					docs:res.data.remark,
					park_id:res.data.park_id,
					park_name:res.data.park_name,
					free_park_hour:res.data.free_park_hour,
					
					price:res.data.price,
					service_price:res.data.service_price,
					price2:res.data.price2,
					service_price2:res.data.service_price2,
					price3:res.data.price3,
					service_price3:res.data.service_price3,
					price4:res.data.price4,
					service_price4:res.data.service_price4,
				}
				
				if(this.formData.start_time2){
					this.num = this.num+1
				}
				if(this.formData.start_time2&&this.formData.start_time3){
					this.num = this.num+1
				}
				
				this.total_count = 0
				this.jian_count = 0
				this.feng_count = 0
				this.ping_count = 0
				this.gu_count = 0
				for(var i=0;i<this.shiqu.length;i++){
					if(this.shiqu[i]==1){
						this.jian_count += 1
					}
					if(this.shiqu[i]==2){
						this.feng_count += 1
					}
					if(this.shiqu[i]==3){
						this.ping_count += 1
					}
					if(this.shiqu[i]==4){
						this.gu_count += 1
					}
					if(this.shiqu[i]!=0){
						this.total_count +=1
					}
				}
			},
			
			async getList() {
				const res = await this.http("get", "/api/park/index", {
					page: 1,limit:100000,type:1
				})
				console.log(res)
				var park_arr = []
				var park_id = []
				for(var i =0;i<res.data.length;i++){
					park_id.push(res.data[i]['id'])
					park_arr.push(res.data[i]['name'])
				}
				this.park_id = park_id
				this.park_arr = park_arr
				
			},
			speed_change(e){
				var arr = ['请选择','快','慢']
				this.formData.speed = arr[e.detail.value]
			},
			
			hour_change(e){
				this.formData.free_park_hour = this.hour_arr[e.detail.value]
				console.log(this.formData.free_park_hour)
			},
			
			park_change(e){
				this.formData.park_id = this.park_id[e.detail.value]
				this.formData.park_name = this.park_arr[e.detail.value]
			},
			
			
			sumfontnum(e){
				this.fontNum=e.detail.value.length
			},

			// 表单验证
			validateForm() {
				if (!this.formData.avatar) {
					uni.showToast({
						title: '请上传电桩头像',
						icon: 'none'
					});
					return false;
				}
				if (!this.formData.name) {
					uni.showToast({
						title: '请输入电桩名称',
						icon: 'none'
					});
					return false;
				}
				
				
				if (this.formData.images.length === 0) {
					uni.showToast({
						title: '请上传电桩详情照片',
						icon: 'none'
					});
					return false;
				}
				
				if (!this.formData.speed) {
					uni.showToast({
						title: '请选择电桩快充慢充',
						icon: 'none'
					});
					return false;
				}
				
				if (!this.formData.docs) {
					uni.showToast({
						title: '请输入停车费说明',
						icon: 'none'
					});
					return false;
				}
				
				return true;
			},

			// 提交表单
			async submitForm() {
				
				if (!this.validateForm()) {
					return;
				}
					
				var location = this.formData.location.split(',')
				this.formData.lat = location[0]
				this.formData.lng = location[1]
				this.formData.pic = this.formData.avatar
				this.formData.cost_model = JSON.stringify(this.shiqu)
				if(this.id!=''){
					this.formData.id = this.id
				}
				
				try {
					const path = this.id ? '/api/device/update' : '/api/device/add';
					console.log(path)
					const response = await this.http('post', path, this.formData, true);
	
					if (response.code === 200) {
						uni.showToast({
							title: '提交成功',
							icon: 'success'
						});
						setTimeout(() => {
							uni.navigateBack();
						}, 1500);
					} else {
						this.toast(response.message);
					}
				} catch (error) {
					console.error('提交失败:', error);
				} finally {
					uni.hideLoading();
				}
			},

			// 上传图片方法
			uploadImage(type) {
				uni.chooseImage({
					count: type === 'images' ? 4 : 1,
					sizeType: ['compressed'],
					sourceType: ['album', 'camera'],
					success: async (res) => {
						const tempFilePaths = res.tempFilePaths;
	
						uni.showLoading({
							title: '上传中...'
						});
	
						try {
							const uploadTasks = tempFilePaths.map(path => {
								return new Promise((resolve, reject) => {
									uni.uploadFile({
										url: 'https://app.yinuoxinnengyuan.cn/index.php/api/index/uploads',
										filePath: path,
										name: 'file',
										success: (uploadRes) => {
											const data = JSON.parse(uploadRes.data);
											resolve(data.data.pic_path);
										},
										fail: reject
									});
								});
							});
	
							const uploadedUrls = await Promise.all(uploadTasks);
	
							if (type === 'avatar') {
								this.formData.avatar = uploadedUrls[0];
							} else if (type === 'images') {
								const newImages = [...this.formData.images, ...uploadedUrls];
								this.formData.images = newImages.slice(0, 4);
							}
	
							uni.showToast({
								title: '上传成功',
								icon: 'success'
							});
						} catch (error) {
							uni.showToast({
								title: '上传失败',
								icon: 'error'
							});
							console.error('上传失败:', error);
						} finally {
							uni.hideLoading();
						}
					}
				});
			},
			
			onStartTimeChange(e) {
				this.formData.start_time = e.detail.value
			},
			
			onEndTimeChange(e) {
				this.formData.end_time = e.detail.value
			},
			
			onStartTimeChange2(e) {
				this.formData.start_time2 = e.detail.value
			},
			
			onEndTimeChange2(e) {
				this.formData.end_time2 = e.detail.value
			},
			
			onStartTimeChange3(e) {
				this.formData.start_time3 = e.detail.value
			},
			
			onEndTimeChange3(e) {
				this.formData.end_time3 = e.detail.value
			},

			
			// 地图区域变化时的处理逻辑
			onMapChange(e) {
				if (e.type === 'end') {
					this.formData.lat = e.detail.centerLocation.latitude
					this.formData.lng = e.detail.centerLocation.longitude
					this.markers[0].latitude = this.formData.lat
					this.markers[0].longitude = this.formData.lng
					this.mapCenter.latitude = this.formData.lat
					this.mapCenter.longitude = this.formData.lng
					
					this.getAddress(e.detail.centerLocation.latitude, e.detail.centerLocation.longitude);
	
					
	
				}
			},
			
			getAddress(latitude, longitude) {
			  // 使用腾讯地图API获取地址名称（示例使用腾讯地图API，你也可以使用高德地图API或其他）
			  const key = 'GKHBZ-RTM3U-Q7WVG-4R3DT-HVAEH-MWFHD'; // 替换为你的API密钥
			  const url = `https://apis.map.qq.com/ws/geocoder/v1/?location=${latitude},${longitude}&key=${key}`;
			  var that = this
			  uni.request({
				url: url,
				method: 'GET',
				success: (res) => {
					console.log(res)
				if ((res.data.status === 0)&&(res.data.message==='Success')) {
					const address = res.data.result.address; // 获取地址信息
					this.markers[0].title = address
					this.markers[0].address = res.data.result.formatted_addresses.recommend
					console.log('地址:', address);
					// 这里可以更新界面或进行其他操作
				  } else {
					console.error('获取地址失败:', res.data.message);
				  }
				},
				fail: (error) => {
				  console.error('请求失败:', error);
				}
			  });
			},

			closeMap() {
				this.showMapDialog = false;
			},

			confirmLocation() {
				this.formData.location = this.formData.lat+','+this.formData.lng;
				this.closeMap();
			},
			
			dianji(e){
				this.loading = false
				if(shiqu[e] == '0'){ 
					shiqu[e] = '1';
				}else if(shiqu[e] == '1'){ 
					shiqu[e] = '2' 
				}else if(shiqu[e] == '2'){ 
					shiqu[e] = '3' 
				}else if(shiqu[e] == '3'){ 
					shiqu[e] = '4' 
				}else if(shiqu[e] == '4'){ 
					shiqu[e] = '0' 
				}
				this.shiqu = shiqu
				
				this.total_count = 0
				this.jian_count = 0
				this.feng_count = 0
				this.ping_count = 0
				this.gu_count = 0
				for(var i=0;i<this.shiqu.length;i++){
					if(this.shiqu[i]==1){
						this.jian_count += 1
					}
					if(this.shiqu[i]==2){
						this.feng_count += 1
					}
					if(this.shiqu[i]==3){
						this.ping_count += 1
					}
					if(this.shiqu[i]==4){
						this.gu_count += 1
					}
					if(this.shiqu[i]!=0){
						this.total_count +=1
					}
				}
				
				
				
				this.loading = true
			},
			
		}
	}
</script>

<style lang="less">
	.btntime{
		width: 23%;margin-left: 2%;background-color: white; color: #000;font-size: 10px; text-align: center; position: relative;
		padding: 5px 2px; margin-top: 5rpx; margin-bottom: 5rpx; border: 1px solid #000; border-radius: 10rpx;
	}
	.bg_1{
		background-color: red !important;
	}
	.bg_2{
		background-color: orangered !important;
	}
	.bg_3{
		background-color: blue !important; 
	}
	.bg_4{
		background-color: green !important;
	}
	.font-num{
		color: #999;
		font-size: 28upx;
		text-align: right;
		display: block;
	}
	.my-content {
		width: 100%;
		padding: 30upx;
		box-sizing: border-box;

		.form-box {
			width: 100%;
			border-radius: 16upx;
			box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.3);
			margin-bottom: 20upx;
			padding: 30upx;
			box-sizing: border-box;
			position: relative;
			.mt20 {
				margin-top: 40upx;
			}
			.add-btn{
				position: absolute;
				color: #3662EC;
				font-size: 60upx;
				top: 0;
				right: 20upx;
			}
			.minus-btn{
				position: absolute;
				font-size: 90upx;
				top: -30upx;
				right: 20upx;
				color: #FA5151;
			}
			.form-title {
				font-size: 36upx;
				color: #000;
				font-weight: 700;
				display: block;
			}

			.ava-img {
				width: 200upx;
				height: 200upx;
				border-radius: 16upx;
				background: #D8D8D8;
				margin: 0 auto;
				overflow: hidden;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;

				text {
					font-size: 100upx;
					color: #A6A6A6;
					line-height: 100upx;
					display: block;
				}

				image {
					width: 100%;
					height: auto;
					display: block;
					position: absolute;
					top: 0;
					left: 0;
				}
			}

			.form-item {
				margin: 20upx 0;
				font-size: 32upx;
				// padding: 20upx 0;

				.blue {
					color: #3662EC;
				}
			}

			.img-list {
				width: 100%;
				display: flex;
				align-items: center;
				margin: 20upx 0 5upx 0;

				.img-add {
					width: 120upx;
					height: 120upx;
					border-radius: 8upx;
					background: #F1F1F1;

					text {
						font-size: 60upx;
						color: #A6A6A6;
						line-height: 120upx;
						text-align: center;
						display: block;
					}
				}

				.img-item {
					width: 120upx;
					height: 120upx;
					border-radius: 8upx;
					overflow: hidden;
					margin-left: 15upx;

					image {
						width: 100%;
						height: auto;
						display: block;
					}
				}
			}

			.num-box {
				display: block;
				width: 100%;
				text-align: right;
				font-size: 32upx;
				color: #A6A6A6;
			}
		}

		.submit {
			width: 100%;
			height: 80upx;
			border-radius: 16upx;
			background: #FF8F1F;
			box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.3);
			color: #fff;
			line-height: 80upx;
			font-size: 44upx;
			font-weight: 700;
			margin-top: 40upx;
		}

		// 模态窗口样式
		.popup-mask {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background: rgba(0, 0, 0, 0.6);
			z-index: 999;
			display: flex;
			align-items: center;
			justify-content: center;

			.popup-content {
				width: 90%;
				background: #fff;
				border-radius: 16upx;
				overflow: hidden;

				.map-dialog {
					width: 100%;

					.dialog-header {
						height: 88upx;
						display: flex;
						align-items: center;
						justify-content: space-between;
						padding: 0 30upx;
						border-bottom: 1px solid #eee;

						.title {
							font-size: 32upx;
							font-weight: 500;
							color: #333;
						}

						.close {
							font-size: 48upx;
							color: #999;
							padding: 0 20upx;
						}
					}

					.map {
						width: 100%;
						height: 600upx;
					}

					.dialog-footer {
						padding: 20upx 30upx;
						display: flex;
						justify-content: space-between;
						gap: 20upx;

						.btn {
							flex: 1;
							height: 80upx;
							border-radius: 8upx;
							font-size: 32upx;
							font-weight: 500;
							line-height: 80upx;
						}

						.cancel-btn {
							background: #F5F5F5;
							color: #666;
						}

						.confirm-btn {
							background: #3662EC;
							color: #fff;
						}
					}
				}
			}
		}
	}
</style>